<template>
  <z-modal
    :width="800"
    v-bind="modalOption"
    :okText="false"
    @ok="handleOk"
    @cancel="handleCancel"
  >
    <a-spin :spinning="confirmLoading">
      <a-form-model layout="horizontal" labelAlign="right" ref="ruleForm" :label-col="labelCol" :wrapper-col="wrapperCol" :model="form" :rules="validatorRules">
        <a-form-model-item label="合同名称" prop="contractName">
          <a-input-search v-model="form.contractName" readOnly @search="onSearchContract" placeholder="请输入合同名称">
            <a-button slot="enterButton">选择合同</a-button>
          </a-input-search>
        </a-form-model-item>
        <a-form-model-item label="客户名称" prop="customerName">
          <a-input v-model.trim="form.customerName" placeholder="请输入客户名称" disabled></a-input>
        </a-form-model-item>
        <a-form-model-item label="收款日期" prop="payTime">
          <a-date-picker v-model="form.payTime"  placeholder="请选择开票时间" style="width: 100%" format="YYYY-MM-DD" @change="(value,dateString) =>{ this.form.payTime = dateString}"/>
        </a-form-model-item>
        <a-form-model-item label="收款方式" prop="payType">
          <z-dict-select-tag v-model="form.payType"  dictCode="pay_type" placeholder="请选择收款方式"/>
        </a-form-model-item>
        <a-form-model-item label="收款金额" prop="receiptMoney">
          <a-input-number placeholder="请输入收款金额" v-model.trim="form.receiptMoney" style="width: 100%" :disabled="disableSubmit"/>
        </a-form-model-item>
        <a-form-model-item label="所属公司" prop="company">
          <a-input v-model.trim="form.company" placeholder="请输入所属公司"></a-input>
        </a-form-model-item>
      </a-form-model>
    </a-spin>
    <SelectContractModal ref="selectModal" @ok="selectOK"></SelectContractModal>
  </z-modal>
</template>

<script>
import ModalFormMixin from '@/mixins/ModalFormMixin'
import ZDictSelectTag from '@/components/dict/ZDictSelectTag'
import ZSelectUserByDep from '@/components/zzbiz/ZSelectUserByDep'
import ZImageUpload from '@/components/zz/ZImageUpload'
import SelectContractModal from '@/pages/crm/contract/modules/SelectContractModal'
export default {
  name: 'CrmContactsModal',
  mixins: [ModalFormMixin],
  components: {
    ZDictSelectTag,
    ZSelectUserByDep,
    ZImageUpload,
    SelectContractModal
  },
  data() {
    return {
      validatorRules: {
        contractName: [
            { required: true, message: '请选择合同!'},
          ],
          payType: [
            { required: true, message: '请选择收款方式!'},
          ],
          receiptMoney: [
            { required: true, message: '请输入收款金额!'},
          ],
        },
      url: {
        add: "/receipt/add",
        edit: "/receipt/edit",
        queryById: "/receipt/queryById"
      }
    }
  },
  methods: {
    addAfter() {
    },
    onSearchContract() {
      this.$refs.selectModal.showModal()
    },
    selectOK(rows, idstr) {
      if(!rows){
        this.form.customerId = ''
        this.form.customerName = ''
        this.form.ownerCustomer = ''
        this.form.contractId = ''
        this.form.contractName = ''
        this.form.contractNum = ''
        this.form.ownerCustomer = ''
      }else{
        let row = rows[0]
        this.form.customerId = row.customerId
        this.form.customerName = row.customerName
        this.form.ownerCustomer = row.ownerCustomer
        this.form.contractId = row.id
        this.form.contractName = row.name
        this.form.contractNum = row.num
        this.form.ownerCustomer = row.ownerCustomer
      }
      this.form = Object.assign({},this.form)
    }
  }
}
</script>
